<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app" >
	 <p>输入倍数：<input v-model="multiple" type="number" step="1" /></p>
	 <p>无关测试值：<input v-model="test" type="number" step="1" /></p>
	 <p>methods 数组倍数求和：{{ mSum() }}</p>
	 <p>computed 数组倍数求和：{{ cSum }}</p>
	 </div>
	 <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
	 <script>
	 const app = new Vue({
		 el: "#app",
		 data: {
		 arr : [1,2,3],
		 multiple : 1,
		 test : 1
		 },
	     methods:{
		 mSum(){
		 console.log("------正在计算 mSum-----");
		 let sum = 0;
		 for(let i = 0; i < this.arr.length; i++){
		 sum += this.multiple * this.arr[i];
		 }
		 return sum;
		 }
		 },
		 computed:{
		 cSum(){
		 console.log("------正在计算 cSum-----");
		 let sum = 0;
		 for(let i = 0; i < this.arr.length; i++){
	    sum += this.multiple * this.arr[i];
		 }
		 return sum;
		 }
		 }
		 });
		 </script>
	</body>
</html>
